import React, { Component } from "react"
import Home from "./Home"
import eventBus from "./utils/event-bus"

export class App extends Component {
    constructor() {
        super()
        this.state = {
            name: "默认",
        }
    }
    handlerClickApp(value) {
        console.log("App", value)
        this.setState({
            name: value,
        })
    }

    componentDidMount() {
        // 绑定
        eventBus.on("handlerClickApp", this.handlerClickApp, this)
    }
    componentWillUnmount() {
        // 解绑
        eventBus.off("handlerClickApp", this.handlerClickApp)
    }
    componentDidUpdate() {
        console.log("update执行")
    }
    shouldComponentUpdate(nextProps, nextState, nextContext) {
        if (nextState.name === this.state.name) {
            return false
        }else {
          return true
        }
    }

    render() {
        const { name } = this.state
        return (
            <div>
                <h2>{name}</h2>
                <Home />
            </div>
        )
    }
}

export default App
